<template>
  <div class="mod-config">
    <el-form :inline="true" :model="dataForm" ref="transportordersearchform"
             @keyup.enter.native="getDatatransportorderList()">
      <el-row>
        <el-form-item class="el-col-6" prop="id" label="运单编号">
          <el-input v-model="dataForm.id" placeholder="运单编号" clearable></el-input>
        </el-form-item>
        <el-form-item class="el-col-6" prop="status" label="运单状态">
          <el-select v-model="dataForm.status" placeholder="运单状态">
            <el-option label="新建" value="1"></el-option>
            <el-option label="已装车" value="2"></el-option>
            <el-option label="到达" value="3"></el-option>
            <el-option label="到达终端网点" value="4"></el-option>
            <el-option label="已签收" value="5"></el-option>
            <el-option label="拒收" value="6"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item class="el-col-9" prop="senderaddress" label="发件人地址">
          <select v-model="sshen" name="" id="ssheng" placeholder="请选择">
            <option value="">---请选择---</option>
          </select>
          <select v-model="sshi" name="" id="sshi" placeholder="请选择">
            <option value="">---请选择---</option>
          </select>
          <select v-model="squ" name="" id="squ" placeholder="请选择">
            <option value="">---请选择---</option>
          </select>
        </el-form-item>
      </el-row>
      <el-row>
        <el-form-item class="el-col-6" prop="sendername" label="发件人姓名">
          <el-input style="border-width: 0" v-model="dataForm.sendername" placeholder="发件人姓名" clearable></el-input>
        </el-form-item>
        <el-form-item class="el-col-6" prop="senderphone" label="发件人电话">
          <el-input v-model="dataForm.senderphone" placeholder="发件人电话" clearable></el-input>
        </el-form-item>
        <el-form-item class="el-col-9" prop="receiveraddress" label="收件人地址">
          <select v-model="rshen" name="" id="rsheng" placeholder="请选择">
            <option value="">---请选择---</option>
          </select>
          <select v-model="rshi" name="" id="rshi" placeholder="请选择">
            <option value="">---请选择---</option>
          </select>
          <select v-model="rqu" name="" id="rqu" placeholder="请选择">
            <option value="">---请选择---</option>
          </select>
        </el-form-item>
      </el-row>
      <el-row>
        <el-form-item class="el-col-7" prop="receivername" label="收件人姓名">
          <el-input v-model="dataForm.receivername" placeholder="收件人姓名" clearable></el-input>
        </el-form-item>
        <el-form-item class="el-col-7" prop="receiverphone" label="收件人电话">
          <el-input v-model="dataForm.receiverphone" placeholder="收件人电话" clearable></el-input>
        </el-form-item>
        <el-form-item>
          <el-button class="el-button--primary" @click="getDatatransportorderList()">查询</el-button>
          <el-button class="el-button--warning" @click="transportorderresetdateform('transportordersearchform')">重置
          </el-button>
        </el-form-item>
      </el-row>
    </el-form>
    <!--  列表   -->
    <el-table
      :data="datatransportorderList"
      border
      v-loading="datatransportorderListLoading"
      @selection-change="selectionChangeHandle"
      style="width: 100%;">
      <el-table-column
        type="selection"
        header-align="center"
        align="center"
        width="50">
      </el-table-column>
      <el-table-column
        prop="id"
        header-align="center"
        align="center"
        label="运单编号">
      </el-table-column>
      <el-table-column
        prop="status"
        header-align="center"
        align="center"
        label="运单状态">
        <tmplate slot-scope="scope">
          <span>{{
              scope.row.status == 1 ? '新建' : scope.row.status == 2 ? '已装车' : scope.row.status == 3 ? '到达' : scope.row.status == 4 ? '到达终端网点' : scope.row.status == 5 ? '已签收' : '拒收'
            }}</span>
        </tmplate>
      </el-table-column>
      <el-table-column
        prop="schedulingStatus"
        header-align="center"
        align="center"
        label="调度状态">
        <tmplate slot-scope="scope">
          <span>{{
              scope.row.schedulingStatus == 1 ? '待调度2' : scope.row.schedulingStatus == 2 ? '未匹配线路3' : '已调度'
            }}</span>
        </tmplate>
      </el-table-column>
      <el-table-column
        prop="orderId"
        header-align="center"
        align="center"
        label="订单编号">
      </el-table-column>
      <el-table-column
        prop="ordercreateTime"
        header-align="center"
        align="center"
        label="下单时间">
      </el-table-column>
      <el-table-column
        prop="sendername"
        header-align="center"
        align="center"
        label="发件人姓名">
      </el-table-column>
      <el-table-column
        prop="senderphone"
        header-align="center"
        align="center"
        label="发件人电话">
      </el-table-column>
      <el-table-column
        prop="senderaddress"
        header-align="center"
        align="center"
        label="发件人地址">
      </el-table-column>
      <el-table-column
        prop="receivername"
        header-align="center"
        align="center"
        label="收件人姓名">
      </el-table-column>
      <el-table-column
        prop="receiverphone"
        header-align="center"
        align="center"
        label="收件人电话">
      </el-table-column>
      <el-table-column
        prop="receiveraddress"
        header-align="center"
        align="center"
        label="收件人地址">
      </el-table-column>
      <el-table-column
        fixed="right"
        header-align="center"
        align="center"
        width="150"
        label="操作">
        <template slot-scope="scope">
          <el-button type="text" size="small" @click="getdetails(scope.row.id)">查看详情</el-button>
        </template>
      </el-table-column>
    </el-table>
    <!--  分页  -->
    <el-pagination
      @size-change="sizeChangeHandle"
      @current-change="currentChangeHandle"
      :current-page="pageIndex"
      :page-sizes="[10, 20, 50, 100]"
      :page-size="pageSize"
      :total="totalPage"
      layout="total, sizes, prev, pager, next, jumper">
    </el-pagination>

    <!--  查看详情模态框  -->
    <el-dialog custom-class="detailcustomwidth" title="运单详情" width="800" :close-on-click-modal="false"
               :visible.sync="transportVisible">
      <el-form ref="courierform">
        <br>
        <el-card>
          <el-row>
            <el-form-item style="font-weight: bold" class="el-col-8" prop="orderId" label="订单编号：">
              <span style="color: gray;font-weight: normal" id="orderId"></span>
            </el-form-item>
            <el-form-item style="font-weight: bold" class="el-col-8" prop="id" label="运单编号：">
              <span style="color: gray;font-weight: normal" id="id"></span>
            </el-form-item>
            <el-form-item style="font-weight: bold" prop="createTime" class="el-col-8" label="下单时间：">
              <span style="color: gray;font-weight: normal" id="createTime"></span>
            </el-form-item>
          </el-row>
          <el-row>
            <el-form-item style="font-weight: bold" prop="status" class="el-col-8" label="订单状态：">
              <span style="color: gray;font-weight: normal" id="status"></span>
            </el-form-item>
            <el-form-item style="font-weight: bold" prop="estimatedArrivalTime" class="el-col-8" label="预计到达日期：">
              <span style="color: gray;font-weight: normal" id="estimatedArrivalTime"></span>
            </el-form-item>
          </el-row>
        </el-card>
        <br>
        <el-card>
          <div class="el-card__header" style="background-color: GhostWhite; margin-top: 0px;margin-left: 0px;margin-right: 0px">
            <div class="clearfix" style="background-color: GhostWhite  ;">
              <h3>基本信息</h3>
            </div>
          </div>
          <el-timeline><!--  icon="el-icon-map-location"    icon="el-icon-aim" -->
            <el-timeline-item timestamp="发货方" placement="top">
              <el-card>
                <el-form-item style="font-weight: bold" prop="senderName" class="el-col-10" label="发货方姓名：">
                  <span style="color: gray;font-weight: normal" id="senderName"></span>
                </el-form-item>
                <el-form-item style="font-weight: bold" prop="senderssqaddress" class="el-col-10" label="发货方地址：">
                  <span style="color: gray;font-weight: normal" id="senderssqaddress"></span>
                </el-form-item>
                <el-form-item style="font-weight: bold" prop="senderPhone" class="el-col-10" label="发货方电话：">
                  <span style="color: gray;font-weight: normal" id="senderPhone"></span>
                </el-form-item>
                <el-form-item style="font-weight: bold" prop="senderAddress" class="el-col-10" label="详细地址：">
                  <span style="color: gray;font-weight: normal" id="senderAddress"></span>
                </el-form-item>
              </el-card>
            </el-timeline-item>
            <el-timeline-item timestamp="收货方" placement="top">
              <el-card>
                <el-form-item style="font-weight: bold" prop="receiverName" class="el-col-10" label="发货方姓名：">
                  <span style="color: gray;font-weight: normal" id="receiverName"></span>
                </el-form-item>
                <el-form-item style="font-weight: bold" prop="receiverssqaddress" class="el-col-10" label="发货方地址：">
                  <span style="color: gray;font-weight: normal" id="receiverssqaddress"></span>
                </el-form-item>
                <el-form-item style="font-weight: bold" prop="receiverPhone" class="el-col-10" label="发货方电话：">
                  <span style="color: gray;font-weight: normal" id="receiverPhone"></span>
                </el-form-item>
                <el-form-item style="font-weight: bold" prop="receiverAddress" class="el-col-10" label="详细地址：">
                  <span style="color: gray;font-weight: normal" id="receiverAddress"></span>
                </el-form-item>
              </el-card>
              <el-row>
                <el-form-item style="font-weight: bold" prop="distance" align="left" class="el-col-8" label="距离：">
                  <span style="color: gray;font-weight: normal" id="distance"></span>
                </el-form-item>
                <el-form-item style="font-weight: bold" prop="senderaddress" class="el-col-8" label="地图：">
                  <span><a href="#">查看地图</a></span>
                </el-form-item>
              </el-row>
            </el-timeline-item>
          </el-timeline>
        </el-card>
        <br>
        <el-card>
          <div class="el-card__header" style="background-color: GhostWhite; margin-top: 0px;margin-left: 0px;margin-right: 0px">
            <div class="clearfix" style="background-color: GhostWhite  ;">
              <h3>费用信息</h3>
            </div>
          </div>
          <el-row>
            <el-form-item style="font-weight: bold" prop="amount" class="el-col-5" label="运费：">
              <span style="color: gray;font-weight: normal" id="amount"></span>
            </el-form-item>
            <el-form-item style="font-weight: bold" prop="paymentMethod" class="el-col-5" label="支付方式：">
              <span style="color: gray;font-weight: normal" id="paymentMethod"></span>
            </el-form-item>
            <el-form-item style="font-weight: bold" prop="paymentStatus" class="el-col-5" label="支付状态：">
              <span style="color: gray;font-weight: normal" id="paymentStatus"></span>
            </el-form-item>
          </el-row>
        </el-card>
        <br>
        <el-card>
          <div class="el-card__header" style="background-color: GhostWhite; margin-top: 0px;margin-left: 0px;margin-right: 0px">
            <div class="clearfix" style="background-color: GhostWhite;">
              <h3>货品信息</h3>
            </div>
          </div>
          <el-table
            :data="dataorderdetailsList"
            border
            v-loading="dataorderdetailsListLoading"
            style="width: 100%;color: black">
            <el-table-column
              prop="name"
              header-align="center"
              align="center"
              label="货品名称">
            </el-table-column>
            <el-table-column
              prop="quantity"
              header-align="center"
              align="center"
              label="货品数量">
            </el-table-column>
            <el-table-column
              prop="unit"
              header-align="center"
              align="center"
              label="货品单位">
            </el-table-column>
            <el-table-column
              prop="goodtype"
              header-align="center"
              align="center"
              label="货品类型">
              <tmplate slot-scope="scope">
                <span>{{ scope.row.status == 1 ? '待取件' : scope.row.status == 2 ? '已取件' : '' }}</span>
              </tmplate>
            </el-table-column>
            <el-table-column
              prop="weight"
              header-align="center"
              align="center"
              label="重量（千克）">
            </el-table-column>
            <el-table-column
              prop="volume"
              header-align="center"
              align="center"
              label="体积（方）">
            </el-table-column>
            <el-table-column
              prop="cargoValue"
              header-align="center"
              align="center"
              label="货值（元）">
            </el-table-column>
            <el-table-column
              prop="cargoBarcode"
              header-align="center"
              align="center"
              label="条形编码">
            </el-table-column>
            <el-table-column
              prop="remark"
              header-align="center"
              align="center"
              label="备注">
            </el-table-column>
          </el-table>
        </el-card>
        <br>
        <el-card>
          <div class="el-card__header" style="background-color: GhostWhite; margin-top: 0px;margin-left: 0px;margin-right: 0px">
            <div class="clearfix" style="background-color: GhostWhite;">
              <h3>取件信息</h3>
            </div>
          </div>
          <el-row>
            <el-form-item style="font-weight: bold" prop="qagencyId" class="el-col-6" label="所在网点：">
              <span style="color: gray;font-weight: normal" id="qagencyId"></span>
            </el-form-item>
            <el-form-item style="font-weight: bold" prop="taskType" class="el-col-6" label="取件类型：">
              <span style="color: gray;font-weight: normal" id="taskType"></span>
            </el-form-item>
            <el-form-item style="font-weight: bold" prop="qsstatus" class="el-col-6" label="作业状态：">
              <span style="color: gray;font-weight: normal" id="qstatus"></span>
            </el-form-item>
            <el-form-item style="font-weight: bold" prop="qcourier" class="el-col-6" label="取件快递员：">
              <span style="color: gray;font-weight: normal" id="qcourier"></span>
            </el-form-item>
          </el-row>
          <el-row>
            <el-form-item style="font-weight: bold" prop="qcphone" class="el-col-6" label="快递员电话：">
              <span style="color: gray;font-weight: normal" id="qcphone"></span>
            </el-form-item>
            <el-form-item style="font-weight: bold" prop="qestimatedStartTime" class="el-col-6" label="预计取件时间：">
              <span style="color: gray;font-weight: normal" id="qestimatedStartTime"></span>
            </el-form-item>
            <el-form-item style="font-weight: bold" prop="qconfirmTime" class="el-col-6" label="取件完成时间：">
              <span style="color: gray;font-weight: normal" id="qconfirmTime"></span>
            </el-form-item>
            <el-form-item style="font-weight: bold" prop="actualEndTime" class="el-col-6" label="实际完成时间：">
              <span style="color: gray;font-weight: normal" id="actualEndTime"></span>
            </el-form-item>
          </el-row>
        </el-card>
        <el-card>
          <div class="el-card__header" style="background-color: GhostWhite; margin-top: 0px;margin-left: 0px;margin-right: 0px">
            <div class="clearfix" style="background-color: GhostWhite;">
              <h3>派送信息</h3>
            </div>
          </div>
          <el-row>
            <el-form-item style="font-weight: bold" prop="pagencyId" class="el-col-6" label="所在网点：">
              <span style="color: gray;font-weight: normal" id="pagencyId"></span>
            </el-form-item>
            <el-form-item style="font-weight: bold" prop="pstatus" class="el-col-6" label="作业状态：">
              <span style="color: gray;font-weight: normal" id="pstatus"></span>
            </el-form-item>
            <el-form-item style="font-weight: bold" prop="pcourier" class="el-col-6" label="派件快递员：">
              <span style="color: gray;font-weight: normal" id="pcourier"></span>
            </el-form-item>
            <el-form-item style="font-weight: bold" prop="pcphone" class="el-col-6" label="快递员电话：">
              <span style="color: gray;font-weight: normal" id="pcphone"></span>
            </el-form-item>
          </el-row>
          <el-row>
            <el-form-item style="font-weight: bold" prop="pestimatedStartTime" class="el-col-6" label="预计派送时间：">
              <span style="color: gray;font-weight: normal" id="pestimatedStartTime"></span>
            </el-form-item>
            <el-form-item style="font-weight: bold" prop="pconfirmTime" class="el-col-6" label="派件完成时间：">
              <span style="color: gray;font-weight: normal" id="pconfirmTime"></span>
            </el-form-item>
          </el-row>
        </el-card>
        <br>
      </el-form>

      <el-card>
        <div class="el-card__header" style="background-color: GhostWhite; margin-top: 0px;margin-left: 0px;margin-right: 0px">
          <div class="clearfix" style="background-color: GhostWhite;">
            <h3>订单轨迹</h3>
          </div>
        </div>
        <baidu-map :center="center"
                   :zoom="zoom"
                   style="height:600px;"
                   scroll-wheel-zoom="scroll-wheel-zoom">
          <!--距离尺-->
          <bm-scale anchor="BMAP_ANCHOR_TOP_RIGHT"></bm-scale>
          <!--        地图转换-->
          <bm-map-type :map-types="['BMAP_NORMAL_MAP', 'BMAP_HYBRID_MAP']" anchor="BMAP_ANCHOR_TOP_LEFT"></bm-map-type>

          <!--        标记点  -->
          <bm-marker :position="center" animation="BMAP_ANIMATION_BOUNCE">
            <bm-label :content="content" :labelStyle="{color: 'red', fontSize : '12px'}" :offset="{width: -35, height: 30}"/>
          </bm-marker>

        </baidu-map>
      </el-card>
      <div slot="footer" class="dialog-footer">
        <el-button @click="transportVisible = false">取消</el-button>
      </div>
    </el-dialog>

  </div>
</template>

<style>
.detailcustomwidth {
  width: 100%;
}

</style>
<script>
import Transportorderdetail from '../order/transportorderdetail'

export default {
  components: {Transportorderdetail}
}
</script>
<script>
import {getTransportOrderInfo, getTransportOrderList} from '../../../api/work'
import {getaddress} from '../../../api/base'

export default {
  data() {
    return {
      dataForm: {
        id: '',
        status: '',
        senderaddress: '',
        sendername: '',
        senderphone: '',
        receiveraddress: '',
        receivername: '',
        receiverphone: '',

      },
      sshen: '',
      sshi: '',
      squ: '',
      rshen: '',
      rshi: '',
      rqu: '',
      dataorderdetailsList: [],
      datatransportorderList: [],
      pageIndex: 1,
      pageSize: 10,
      totalPage: null,
      dataorderListLoading: false,
      transportVisible: false,
      datatransportorderListLoading: false,
      datatransportorderListSelections: [],
      makecourierVisible: false,
      item: {
        type: '',
        lable: ''
      },
      clist: [],

      center: {lng: 104.052642, lat:30.587787},
      zoom: 5,
      //覆盖范围半径 分公司为80000  一级转运中心为40000   二级转运中心为20000 网点为5000
      content:"品达物流集团有限公司",
    }
  },
  created() {
    this.getsprovince()
    this.getrprovince()
  },
  mounted() {
    this.getDatatransportorderList()
  },
  watch: {
    sshen: { //监听当前地区值的变化，于与上方地区值进行了双向绑定
      deep: true,  //深度监听
      handler() {
        this.getscitybyprovince()
      }
    },
    sshi: {
      deep: true,  //深度监听
      handler() {
        this.getsareabycity()
      }
    },
    rshen: { //监听当前地区值的变化，于与上方地区值进行了双向绑定
      deep: true,  //深度监听
      handler() {
        this.getrcitybyprovince()
      }
    },
    rshi: {
      deep: true,  //深度监听
      handler() {
        this.getrareabycity()
      }
    }
  },
  methods: {
    getsprovince() {
      getaddress(0).then(res => {
        var frag = document.createDocumentFragment()
        let province = res.data.address
        for (let i = 0; i < province.length; i++) {
          var option = document.createElement('option')
          option.innerHTML = province[i].name
          option.value = province[i].id
          frag.appendChild(option)
        }
        document.getElementById('ssheng').appendChild(frag)
      }).catch(error => {
        console.log(error)
      })
    },
    getrprovince() {
      getaddress(0).then(res => {
        var frag = document.createDocumentFragment()
        let province = res.data.address
        for (let i = 0; i < province.length; i++) {
          var option = document.createElement('option')
          option.innerHTML = province[i].name
          option.value = province[i].id
          frag.appendChild(option)
        }
        document.getElementById('rsheng').appendChild(frag)
      }).catch(error => {
        console.log(error)
      })
    },
    getscitybyprovince() {
      document.getElementById('sshi').innerHTML = '<option value="">---请选择---</option>'
      document.getElementById('squ').innerHTML = '<option value="">---请选择---</option>'
      //获取当前省份值id，获取该省份下城市
      getaddress(this.sshen).then(res => {
        var frag = document.createDocumentFragment()
        let city = res.data.address
        for (let i = 0; i < city.length; i++) {
          var option = document.createElement('option')
          option.innerHTML = city[i].name
          option.value = city[i].id
          frag.appendChild(option)
        }
        document.getElementById('sshi').appendChild(frag)
        this.cityaddr = res.data.address
      })
        .catch(error => {
          console.log(error)
        })
    },
    getrcitybyprovince() {
      document.getElementById('rshi').innerHTML = '<option value="">---请选择---</option>'
      document.getElementById('rqu').innerHTML = '<option value="">---请选择---</option>'
      //获取当前省份值id，获取该省份下城市
      getaddress(this.rshen).then(res => {
        var frag = document.createDocumentFragment()
        let city = res.data.address
        for (let i = 0; i < city.length; i++) {
          var option = document.createElement('option')
          option.innerHTML = city[i].name
          option.value = city[i].id
          frag.appendChild(option)
        }
        document.getElementById('rshi').appendChild(frag)
        this.cityaddr = res.data.address
      })
        .catch(error => {
          console.log(error)
        })
    },
    getsareabycity() {
      document.getElementById('squ').innerHTML = '<option value="">---请选择---</option>'
      //获取当前城市值id，获取该城市下区域
      getaddress(this.sshi).then(res => {
        var frag = document.createDocumentFragment()
        let area = res.data.address
        for (let i = 0; i < area.length; i++) {
          var option = document.createElement('option')
          option.innerHTML = area[i].name
          option.value = area[i].id
          frag.appendChild(option)
        }
        document.getElementById('squ').appendChild(frag)
        this.cityaddr = res.data.address
      })
        .catch(error => {
          console.log(error)
        })
    },
    getrareabycity() {
      document.getElementById('rqu').innerHTML = '<option value="">---请选择---</option>'
      //获取当前城市值id，获取该城市下区域
      getaddress(this.rshi).then(res => {
        var frag = document.createDocumentFragment()
        let area = res.data.address
        for (let i = 0; i < area.length; i++) {
          var option = document.createElement('option')
          option.innerHTML = area[i].name
          option.value = area[i].id
          frag.appendChild(option)
        }
        document.getElementById('rqu').appendChild(frag)
        this.cityaddr = res.data.address
      })
        .catch(error => {
          console.log(error)
        })
    },
    transportorderresetdateform(searchform) {
      this.getsprovince()
      this.getrprovince()
      this.sshen = ''
      this.rshen = ''
      this.sshi = ''
      this.rshi = ''
      this.squ = ''
      this.rqu = ''
      document.getElementById('ssheng').innerHTML = '<option value="">---请选择---</option>'
      document.getElementById('rsheng').innerHTML = '<option value="">---请选择---</option>'
      document.getElementById('sshi').innerHTML = '<option value="">---请选择---</option>'
      document.getElementById('squ').innerHTML = '<option value="">---请选择---</option>'
      document.getElementById('rshi').innerHTML = '<option value="">---请选择---</option>'
      document.getElementById('rqu').innerHTML = '<option value="">---请选择---</option>'
      this.$refs['transportordersearchform'].resetFields()
      this.getDatatransportorderList()
    },
    // 获取数据列表
    getDatatransportorderList() {
      let res = JSON.stringify(this.dataForm)
      this.datatransportorderListLoading = true
      let params = {
        'pageno': this.pageIndex,
        'pagesize': this.pageSize,
        'id': this.dataForm.id,
        'status': this.dataForm.status,
        'senderaddress': this.sshen + ',' + this.sshi + ',' + this.squ,
        'sendername': this.dataForm.sendername,
        'senderphone': this.dataForm.senderphone,
        'receivername': this.dataForm.receivername,
        'receiverphone': this.dataForm.receiverphone,
        'receiveraddress': this.rshen + ',' + this.rshi + ',' + this.rqu,
      }
      getTransportOrderList(params).then(({data}) => {
        if (data && data.code == 0) {
          this.datatransportorderList = data.page.rows
          this.totalPage = data.page.total
          } else {
            this.dataList = []
            this.totalPage = 0
          }
        this.datatransportorderListLoading = false
      })
    },
    // 每页数
    sizeChangeHandle(val) {
      this.pageSize = val
      this.pageIndex = 1
      this.getDatatransportorderList()
    },
    // 当前页
    currentChangeHandle(val) {
      this.pageIndex = val
      this.getDatatransportorderList()
    },
    // 多选
    selectionChangeHandle(val) {
      this.datatransportorderListSelections = val
    },
    querycorier() {
      querycourier().then(res => {
        console.log(res.data)
        this.clist = res.data.courier
      })
    },

    makecourier() {
      var ids = this.datatransportorderListSelections.map(item => {
        return item.id
      })
      var idstr = ''
      for (let i = 0; i < ids.length; i++) {
        idstr = idstr + ids[i] + ','
      }
      var courierid = this.courierid
      let params = {
        'cid': courierid,
        'ids': idstr
      }
      if (this.datatransportorderListSelections.length > 0) {
        makecourier(params).then(({data}) => {
          if (data && data.code == 0) {
            this.$message({
              message: '操作成功',
              type: 'success',
              duration: 1500,
              onClose: () => {
                this.makecourierVisible = false
                this.$refs['courierform'].resetFields()
                this.getDatatransportorderList()
              }
            })
          }
        })
      } else {
        this.$message({
          message: '请勾选要分配的快递员',
          type: 'warning'
        })
      }
    },
    updatestatus(id) {
      updatestausbyid(id).then(({data}) => {
        if (data && data.code == 0) {
          this.$message({
            message: '操作成功',
            type: 'success',
            duration: 1500,
            onClose: () => {
              this.visible = false
              this.$emit('refreshDataList')
            }
          })
        } else {
          this.$message.error(data.msg)
        }
      })
    },
    getdetails(oid) {
      getTransportOrderInfo(oid).then(res => {
        console.log(res.data.ordercargo)
        console.log(res.data.order)
        this.dataorderdetailsList = res.data.ordercargo
        document.getElementById('orderId').innerHTML = res.data.transportOrder.orderId
        document.getElementById('id').innerHTML = res.data.transportOrder.id
        document.getElementById('createTime').innerHTML = res.data.order.createTime
        document.getElementById('status').innerHTML = res.data.order.status == 1 ? '待取件' : res.data.order.status == 2 ? '已取件' : res.data.order.status == 3 ? '网点入库' : res.data.order.status == 4 ? '待装车' : res.data.order.status == 5 ? '运输中' : res.data.order.status == 6 ? '网点出库' : res.data.order.status == 7 ? '待派送' : res.data.order.status == 8 ? '派送中' : res.data.order.status == 9 ? '已签收' : res.data.order.status == 10 ? '拒收' : res.data.order.status == 11 ? '已取消' : '全部'
        document.getElementById('estimatedArrivalTime').innerHTML = res.data.order.estimatedArrivalTime
        document.getElementById('senderName').innerHTML = res.data.order.senderName
        document.getElementById('senderssqaddress').innerHTML = res.data.order.senderssqaddress
        document.getElementById('senderPhone').innerHTML = res.data.order.senderPhone
        document.getElementById('senderAddress').innerHTML = res.data.order.senderAddress
        document.getElementById('receiverName').innerHTML = res.data.order.receiverName
        document.getElementById('receiverssqaddress').innerHTML = res.data.order.receiverssqaddress
        document.getElementById('receiverPhone').innerHTML = res.data.order.receiverPhone
        document.getElementById('receiverAddress').innerHTML = res.data.order.receiverAddress
        document.getElementById('distance').innerHTML = res.data.order.distance
        document.getElementById('amount').innerHTML = res.data.order.amount
        document.getElementById('paymentMethod').innerHTML = res.data.order.paymentMethod == 1 ? '预付' : '到付'
        document.getElementById('paymentStatus').innerHTML = res.data.order.paymentStatus == 1 ? '未付' : '已付'
        document.getElementById('qagencyId').innerHTML = res.data.taskpd.agencyname
        document.getElementById('taskType').innerHTML = res.data.taskpd.taskType == 1 ? '取件任务' : '派件任务'
        document.getElementById('qstatus').innerHTML = res.data.taskpd.status == 1 ? '待提货' : res.data.taskpd.status == 2 ? '在途中' : res.data.taskpd.status == 4 ? '已交付' : '已取消'
        document.getElementById('qcourier').innerHTML = res.data.taskpd.courier
        document.getElementById('qcphone').innerHTML = res.data.taskpd.cphone
        document.getElementById('qestimatedStartTime').innerHTML = res.data.taskpd.estimatedStartTime
        document.getElementById('qconfirmTime').innerHTML = res.data.taskpd.confirmTime
        document.getElementById('actualEndTime').innerHTML = res.data.taskpd.actualEndTime
        document.getElementById('pagencyId').innerHTML = res.data.taskpd.agencyname
        document.getElementById('pstatus').innerHTML = res.data.taskpd.status == 1 ? '待提货' : res.data.taskpd.status == 2 ? '在途中' : res.data.taskpd.status == 4 ? '已交付' : '已取消'
        document.getElementById('pcourier').innerHTML = res.data.taskpd.courier
        document.getElementById('pcphone').innerHTML = res.data.taskpd.cphone
        document.getElementById('pestimatedStartTime').innerHTML = res.data.taskpd.estimatedStartTime
        document.getElementById('pconfirmTime').innerHTML = res.data.taskpd.confirmTime
      })
      this.transportVisible = true
    },
  }
}
</script>
